<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    账号<input class="account" type="text"> 
    密码<input class="pwd" type="text">
    生日<input class="birthday" type="text">
    性别<input class="sex" type="text">
    身高<input class="height" type="text">
    体重<input class="weight" type="text">
    鞋码<input class="shoe-size" type="text">
    饭量<input class="rice" type="text">
    
    记住密码<input class="record" type="checkbox">

    <script>

        const initParams = {
            'account': '',
            'pwd': '',
            'birthday': '',
            'sex': '',
            'height': '',
            'weight': '',
            'shoe-size': '',
            'rice': '',
        };

        // to fix
        const doms = {};

        // 得到dom元素
        for (const key in initParams) {
            doms[key] = document.querySelector('.' + key);
        }

        init();

        record.addEventListener('change', function (e) {
            e.target.checked ? save() : clear();
        });

        // 存储
        function save () {
            for (const key in doms) {
                initParams[key] = doms[key].value;
            }
            localStorage.setItem('params', JSON.stringify(initParams));
            alert('记住了');
        }

        // 清空
        function clear () {
            localStorage.removeItem('params');
            alert('已清空');
        }

        // 初始化（返显）
        function init () {
            const paramsStr = localStorage.getItem('params');
            const params = paramsStr ? JSON.parse(paramsStr) : initParams; // parameters 参数
            
            for (const key in doms) {
                doms[key].value = params[key];
            }
        }

    </script>
</body>
</html>
